<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css"/>
<link rel="stylesheet" type="text/css" href="../Css/index.css"/>
<script type="text/javascript" src='../Js/jquery-2.2.2.min.js'></script>
</head>
<style type="text/css">
	.on{
		border-bottom: 3px solid #F10582;
	}
</style>
<script type="text/javascript">
$(function(){
	var timer = '';
	var n = 0;
// 自动播放轮播函数
	function run(){
		n++
		if(n==3){
			n = 0;
		}

		$('.imgShow img').fadeOut().eq(n).fadeIn();
		
		$('.imgShow li').removeClass().eq(n).addClass('on');
	}
	timer = setInterval(run,3000);
});
</script>
<body>
<!--=============================
	顶部内容开始(可作为公共头部)
==============================-->
<div class="topAll">
	<div class="top">
		<div class="topCate">
			<div class="topArea">
				<span>北京</span>
				<span class="glyphicon glyphicon-triangle-bottom"></span>
			</div>
			<div class="topGuide">
				<ul>
					<li>&nbsp;请登录&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;注册&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;我的订单&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>								
					<li>&nbsp;我的收藏&nbsp;<span class="glyphicon glyphicon-triangle-bottom"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;会员俱乐部&nbsp;<span class="glyphicon glyphicon-triangle-bottom"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;客户服务&nbsp;<span class="glyphicon glyphicon-triangle-bottom"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;<span class="glyphicon glyphicon-phone"></span>&nbsp;手机版&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/</li>
					<li>&nbsp;更多&nbsp;<span class="glyphicon glyphicon-triangle-bottom"></span></li>
				</ul>
			</div>
		</div>
	</div>
	<div class="topMidAll">
		<div class="topMid">
			<div class="topLogo">
				<img src="../images/logo.png"/>
			</div>
			<div class="topImg">
				<ul>
					<li><img src="../images/zhengpin.jpg"/></li>
					<li><img src="../images/7days.jpg"/></li>
					<li><img src="../images/tuihuo.jpg"/></li>
					<li class="shoppingCart">&nbsp;&nbsp;&nbsp;|<span class="glyphicon glyphicon-shopping-cart"></span>&nbsp;&nbsp;我的购物车</li>
				</ul>
			</div>
		</div>
	</div>
	<div class="topBottom">
		<div class="topNav">
			<ul>
				<li style="width: 65px;">首页</li>
				<li style="width: 110px;">5.20全球购</li>
				<li style="width: 70px;">母婴</li>
				<li style="width: 70px;">美妆</li>
				<li style="width: 70px;">居家</li>
				<li style="width: 70px;">男士</li>
				<li style="width: 95px;">唯品国际</li>
				<li style="width: 93px;">唯品金融</li>
				<li style="width: 70px;">旅行</li>
				<li style="width: 120px;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-calendar"></span>&nbsp;&nbsp;明天上线</li>
				<li style="width: 180px;">&nbsp;&nbsp;&nbsp;&nbsp;<span class="glyphicon glyphicon-align-justify"></span>&nbsp;&nbsp;在售分类</li>
			</ul>
		</div>
	</div>
</div>
<!--================
	顶部内容结束
=================-->

<!--================
	轮播图区域开始
=================-->
<div class="imgAll">
	<div class="imgShow">
		<img src="../images/img.jpg" style="display: block;"/>
		<img src="../images/1.jpg"/>
		<img src="../images/2.jpg"/>
		<ul>
			<li>今日特惠大牌</li>
			<li>至潮搭，致青春</li>
			<li>宝姿品牌钜献</li>
		</ul>
	</div>
</div>
<!--================
	轮播图区域结束
=================-->
<!--================
	商品区域开始
=================-->
<div class="shop">
	<div class="shopHotCate">
		<img src="../images/temai.png"/>
	</div>
	<div class="shopHot">
		<ul>
			<li><img src="../images/mei.jpg"/></li>
			<li style="width: 20px;border: 1px solid white;"></li>
			<li><img src="../images/nvxie.jpg"/></li>
		</ul>
	</div>
	<div class="shopGirlsCate">
		<span class="shopGirlsAll">全部女装品牌&nbsp;<span class="glyphicon glyphicon-chevron-right"></span></span>
		<div class="shopGirlsTitle">
			<h2><strong>女装</strong>品牌<span>WOMEN'S FASHION</span></h2>
		</div>
	</div>
	<div class="shopGirls">
		<ul>
			<li>
				<img src="../images/nvzhuang2.jpg"/>
				<p>&nbsp;&nbsp;<strong>1</strong>&nbsp;折起 乔万尼Gowani女装专场</p>
			</li>
			<li style="width: 20px;border: 1px solid white;"></li>
			<li>
				<img src="../images/nvzhuang.jpg"/>
				<p>&nbsp;&nbsp;<strong>1.4</strong>&nbsp;折起 蕾朵LIEDOW女装专场</p>
			</li>
		</ul>
	</div>
</div>
<!--================
	商品区域结束
=================-->
<!--================
	底部区域开始
=================-->
<div class="bottomAll">
	<div class="bottomImg">
		<img src="../images/bottom.png"/>
	</div>
	<div class="bottomCate">
		<div>
			<p>服务保障</p>
			<ul>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
			</ul>
		</div>
		<div>
			<p>服务保障</p>
			<ul>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
			</ul>
		</div>
		<div>
			<p>服务保障</p>
			<ul>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
			</ul>
		</div>
		<div>
			<p>服务保障</p>
			<ul>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
			</ul>
		</div>
		<div>
			<p>服务保障</p>
			<ul>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
				<li>正品保证</li>
			</ul>
		</div>
		<div style="border: none;">
			<p style="margin-left: 5px;">唯品会APP二维码</p>
			<img src="../images/Vip.png"/>
			<p style="margin-left: 5px;">下载唯品会移动APP</p>
		</div>
	</div>
	<div class="bottomGuide">
		<div>
			<ul>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们|</li>
				<li>关于我们</li>
			</ul>
		</div>
		<div class="bottommes">
			<p>Copyright © 2008-2016 vip.com，All Rights Reserved 粤ICP备08114786号 ICP经营许可证：粤B2-20080329 网络文化经营许可证：粤网文〔2015〕1528-229</p>
			<p>使用本网站即表示接受唯品会用户协议。版权所有 广州唯品会信息科技有限公司</p>
		</div>
	</div>
</div>
<!--================
	底部区域结束
=================-->
<!--================
	公共右侧用户区域开始
=================-->
<div class="rightUser">
	<div class="rightUserTop">
		<ul>
			<br />
			<br />
			<br />
			<br />
			<br />
			<br />
			<li class="glyphicon glyphicon-user"></li>
			<li>账号</li>
			<br />
			<br />
			<li class="glyphicon glyphicon-yen"></li>
			<li>券</li>
			<br />
			<br />
			<li class="glyphicon glyphicon-heart"></li>
			<li>品牌</li>
			<br />
			<br />
			<li class="glyphicon glyphicon-star"></li>
			<li>商品</li>
		</ul>
	</div>
	<div class="rightUserBottom">
		<ul>
			<br />
			<li class="glyphicon glyphicon-shopping-cart"></li>
			<li>购</li>
			<li>物</li>
			<li>车</li>
			<br />
			<li class="glyphicon glyphicon-pencil"></li>
			<br />
			<br />
			<br />
			<li class="glyphicon glyphicon-menu-up"></li>
		</ul>
	</div>
</div>
<!--================
	公共右侧用户区域结束
=================-->
</body>
</html>
